//<template>
  <div>index
    <el-dialog
  title="提示"
  :visible.sync="dialogVisible"
  width="30%">
  <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="日期">
    <el-input v-model="form.date"></el-input>
  </el-form-item>
    <el-form-item label="姓名">
    <el-input v-model="form.name"></el-input>
  </el-form-item>
    <el-form-item label="地址">
    <el-input v-model="form.city"></el-input>
  </el-form-item>
  </el-form>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
</el-dialog>
     <el-table
    :data="tableData"
    stripe
    style="width: 100%">
    <el-table-column
      prop="date"
      label="日期"
      width="180">
    </el-table-column>
    <el-table-column
      prop="name"
      label="姓名"
      width="180">
    </el-table-column>
    <el-table-column
      prop="city"
      label="地址">
    </el-table-column>
    <el-table-column
      fixed="right"
      label="操作"
      width="100">
      <template slot-scope="scope">
        <el-button @click="handleClick(scope.row)" type="text" size="small">删除</el-button>
        <el-button @click="handlebj(scope.row)" type="text" size="small">编辑</el-button>
      </template>
    </el-table-column>
  </el-table>
   
  </div>
</template>

<script>
import axios from 'axios'
import '../../api/list'
export default {
    
data() {
    return {
           tableData:[],   dialogVisible: false,  form: {
          name: '',
          city: '',
          title: '',
          id: '',
        }
    }
},
    methods: {
      handleClick(row) {
        console.log(row);
        this.tableData.forEach((item,index) => {
            if(item.id==row.id){
                  this.tableData.splice(index, 1)
            }
        })
      },handlebj(row){
        this.dialogVisible=true
    this.form=row
      }
    },
created(){
    axios.get('/list', {
      params: {}
    }).then((ret) => {
      this.tableData=(ret.data.list)
      console.log(   this.tableData);
    })
},

}
</script>

<style>

</style>